<template>
	<view>
		<view class="nav-list">
			<view class="nav-item" style="background-color: #00ffff 1px solid;" @click="tabTrigger(1)">
				挂号订单
			</view>
			<view class="nav-item" style="background-color: #55ff00 1px solid;" @click="tabTrigger(2)">
				检查项目
			</view>
			<view class="nav-item" style="background-color: #cccccc 1px solid;" @click="tabTrigger(3)">
				处方订单
			</view>
		</view>


		<uni-section title="挂号信息" type="line" v-show="active == 1">
			<uni-card :is-shadow="false" v-for="(item,index) in Data">
				<uni-list>
					<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="单号ID"
						:rightText='item.oId+""' />
					<uni-list-item showExtraIcon="true" title="医生" :rightText="item.dName" />
					<uni-list-item showExtraIcon="true" title="挂号时间" :rightText="item.oStart" />
				</uni-list>
			</uni-card>
		</uni-section>
		
		<uni-section title="检查项目" type="line" v-show="active == 2">
			<uni-card :is-shadow="false" v-for="(item,index) in progremData">
				<uni-list>
					<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="单号ID"
						:rightText='item.oId+""' />
					<uni-list-item showExtraIcon="true" title="检查项目" :rightText="item.oCheck" />
					<uni-list-item showExtraIcon="true" title="挂号时间" :rightText="item.oStart" />
				</uni-list>
			</uni-card>
		</uni-section>
		
		<uni-section title="处方订单" type="line" v-show="active == 3">
			<uni-card :is-shadow="false" v-for="(item,index) in drugsData">
				<uni-list>
					<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="单号ID"
						:rightText='item.oId+""' />
					<uni-list-item showExtraIcon="true" title="病因" :rightText="item.oRecord" />
					<uni-list-item showExtraIcon="true" title="处方" :rightText="item.oDrug" />
					<uni-list-item showExtraIcon="true" title="挂号时间" :rightText="item.oStart" />
				</uni-list>
			</uni-card>
		</uni-section>
		
		
	</view>
</template>

<script>
	import {
		findOrderByPid,
		findOrderByDidApp
	} from "@/api/system/registe";
	export default {
		data() {
			return {
				active:1,
				Data: [],
				progremData: [],
				drugsData:[]
			}
		},
		onLoad() {
			this.active = 1;
			this.tabTrigger(this.active);
		},
		methods:{
			tabTrigger(active){
				this.active = active;
				if(active == 1){
					this.handleRegiste();
				}else if(active == 2){
					this.handleProgrem();
				}else{
					this.handlePrescription();
				}
			},
			handleRegiste(){
				this.active = 1
				const pid = uni.getStorageSync('pid');
				findOrderByPid(pid).then(res => {
					this.Data = res.data
					// console.log(this.Data)
				})
			},
			handleProgrem(){
				this.active = 2
				const pid = uni.getStorageSync('pid');
				var data = {
					pageNum: 1,
					size: 50,
					query: pid
				}
				findOrderByDidApp(data).then(res => {
					this.progremData = res.data.orders
					console.log("放假放假"+JSON.stringify(this.progremData))
				})
			},
			handlePrescription(){
				this.active = 3
				const pid = uni.getStorageSync('pid');
				var data = {
					pageNum: 1,
					size: 50,
					query: pid
				}
				findOrderByDidApp(data).then(res => {
					this.drugsData = res.data.orders
					console.log("放假放假"+JSON.stringify(this.progremData))
				})
			}
		}
	}
</script>

<style>
	.nav-list {
		display: flex;
		justify-content: space-around;
		margin: 15px 0;
	}

	.container {
		overflow: hidden;
	}

	.custom-cover {
		flex: 1;
		flex-direction: row;
		position: relative;
	}

	.cover-content {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 40px;
		background-color: rgba($color: #000000, $alpha: 0.4);
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-left: 15px;
		font-size: 14px;
		color: #fff;
	}

	.card-actions {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		height: 45px;
		border-top: 1px #eee solid;
	}

	.card-actions-item {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.card-actions-item-text {
		font-size: 12px;
		color: #666;
		margin-left: 5px;
	}

	.cover-image {
		flex: 1;
		height: 150px;
	}

	.no-border {
		border-width: 0;
	}
</style>